﻿@model CategoriesViewModel
@{
    ViewBag.Title = "Categories";
    Layout = "~/Areas/Admin/Views/Shared/_AdminLayout.cshtml";
}
@section Styles
{
    <link href="@Url.Content("~/Areas/Admin/Content/zatify/Css/pop_ups.css")" rel="stylesheet" type="text/css" />
    <style type="text/css">
        #tree ul.dynatree-container
        {
            height: 220px;
            overflow: scroll;
        }
        .categories_content fieldset
        {
            float: left;
            width: 44%;
        }
    </style>
}
@section Scripts
{
    <script src="@Url.Content("~/Areas/Admin/Scripts/pop_ups.js")" type="text/javascript"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/dynatree-1.2.2/jquery/jquery.min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/dynatree-1.2.2/jquery/jquery-ui.custom.min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/dynatree-1.2.2/jquery/jquery.cookie.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/dynatree-1.2.2/dist/jquery.dynatree.min.js")"></script>
    <!-- Add code to initialize the tree when the document is loaded: -->
    <script type="text/javascript">
        var updateDialogControl;

        $(document).ready(function () {

            var btnAddNewCategory = $("#btnAddNewCategory");
            var btnDeleteCategies = $("#btnDeleteCategories");
            var btnEditCategory = $("#btnEditCategory");
            var btnMoveCategory = $("#btnMoveCategory");
            var hiddenParentId = $("#ParentId");
            var hiddenCategoriesIds = $("#categoriesIds");

            var btnAddRequestedCategories = $("#btnAddRequestedCategories");
            var btnRejectRequestedCategories = $("#btnRejectRequestedCategories");
            var hiddenAddRequestedCategories = $("#addRequestedCategories");
            var hiddenParentCategoryId = $("#parentCategoryId");

            var selectedNodes;
            var selectedKeys;

            var mainDynoTree = $("#tree").dynatree({
                onSelect: function (flag, dtnode) {
                    // This will happen each time a check box is selected/deselected
                    selectedNodes = dtnode.tree.getSelectedNodes();
                    selectedKeys = $.map(selectedNodes, function (node) {
                        return node.data.key;
                    });

                    hiddenCategoriesIds.val(selectedKeys.join(","));

                    if (selectedNodes.length != 1) {

                        hiddenParentId.val("");
                        //hiddenCategoriesIds.val("");
                    }
                    else {

                        // Set the hidden input field's value to the selected items
                        hiddenParentId.val(selectedKeys.join(","));
                    }
                },
                checkbox: true,
                classNames: { nodeIcon: "" }
            });

            // Remove all of the icons from the tree
            $('#tree .ui-dynatree-icon').remove();

            btnAddNewCategory.click(function (e) {

                if (!selectedNodes || selectedNodes.length == 0 || selectedNodes.length == 1) {

                    addNewCategory_Popup.ShowDialog(true);
                    updateDialogControl = $(addNewCategory_Popup.id);
                                 
                    SetNotMergeable();
                    e.preventDefault();
                }
                else {

                    alert("You can select only one parent category in category tree");
                    e.preventDefault();
                }
            });

            btnEditCategory.click(function (e) {

                var node = mainDynoTree.dynatree("getActiveNode");
                
                if (node) {

                $.ajax({
                        url: "@Url.Action("GetCategory", "Categories")",
                        type: 'GET',
                        data: { id: node.data.key },
                        success: function (result) {

                            var message = result.message;

                            if(result){

                                updateCategory_Popup.ShowDialog(true);
                                e.preventDefault();

                                var updateCategoryFormHtml = $(updateCategory_Popup.id);
                                updateDialogControl = updateCategoryFormHtml;
                                updateCategoryFormHtml.find("#CategoryId").val(result.CategoryId);
                                updateCategoryFormHtml.find("#ParentId").val(result.ParentId);
                                updateCategoryFormHtml.find("#CategoryName").val(result.CategoryName);
                                updateCategoryFormHtml.find("#SortOrder").val(result.SortOrder);
                                updateCategoryFormHtml.find("#IsSingularSelection").prop('checked', result.IsSingularSelection);
                                updateCategoryFormHtml.find("#IsRoot").prop('checked', result.IsRoot);
                                updateCategoryFormHtml.find("#NotMergeable").prop('checked', result.NotMergeable);
                                updateCategoryFormHtml.find("#CategoryDescription").val(result.CategoryDescription);

                                SetNotMergeable();
                            }
                        },
                        error: function(){
                        
                            alert("Error occured durrin Updating category");
                        }
                    });
                }
            });

            btnMoveCategory.click(function (e)
            {
                if(!selectedNodes || selectedNodes.length < 1 || selectedNodes.length > 1)
                {
                    alert("You must select only one category to move");
                }
                else
                {
                    var catId = selectedNodes[0].data.key;

                    $.ajax({
                        url: "@Url.Action("GetCategoriesTree", "Categories")",
                        data: { id: catId },
                        success: function (result, textStatus, xhr)
                        {
                            if(result.indexOf("treeParentCategories") == -1)
                            {      
                                window.location.replace("@Url.Action("List", "Categories")");
                            }
                            else
                            {
                                $(moveCategory_Popup.id).find("#treeParentCategoriesContent").html(result);
                                $(moveCategory_Popup.id).find("#categoryIdToMove").val(catId);
                            }
                        }
                    });

                    moveCategory_Popup.ShowDialog(true);
                }

                e.preventDefault();
            });

            btnDeleteCategies.click(function (e) {

                if (!selectedNodes || selectedNodes.length < 1) {

                    e.preventDefault();
                    alert("You must select one category to delete in category tree");
                }
                else {

                    if (!confirm("Are you sure you want to delete selected category?")) {

                        e.preventDefault();
                    }
                }
            });

            btnAddRequestedCategories.click(function (e) {

                if (!selectedNodes || selectedNodes.length == 0 || selectedNodes.length == 1) {

                    hiddenParentCategoryId.val(hiddenParentId.val());
                    hiddenAddRequestedCategories.val(true);
                }
                else {

                    alert("You can select only one parent category in category tree");
                    e.preventDefault();
                }
            });

            btnRejectRequestedCategories.click(function (e) {

                hiddenAddRequestedCategories.val(false);
            });
        });

        function SetNotMergeable()
        {
            var isRoot = updateDialogControl.find('#IsRoot').prop('checked');
            if (isRoot)
            {
                updateDialogControl.find('#trNotMergeable').show();
            }
            else
            {
                updateDialogControl.find('#NotMergeable').prop('checked', false);
                updateDialogControl.find('#trNotMergeable').hide();
            }
        }



    </script>
    <script type="text/javascript">

        var addNewCategory_Popup = new PopUp("addNewCategory_Popup", "overlay");
        var updateCategory_Popup = new PopUp("updateCategory_Popup", "overlay");
        var moveCategory_Popup = new PopUp("moveCategory_Popup", "overlay");

        $(document).ready(function () {

            $("#btnClose, #btnCancel").click(function (e) {

                $("#addNewCategory_Popup, #updateCategory_Popup, #moveCategory_Popup").find("input[type=text], input[type=password]").each(function () {
                    $(this).val("");
                    $(this).removeClass("input-validation-error");
                });

                $("#addNewCategory_Popup, #updateCategory_Popup").find("span.field-validation-error").each(function () {
                    $(this).removeClass("field-validation-error").addClass("field-validation-valid");
                });

                addNewCategory_Popup.CloseDialog();
                updateCategory_Popup.CloseDialog();
                moveCategory_Popup.CloseDialog();

                e.preventDefault();
            });
        })

    </script>
}
<!--start add new part-->
<div class="categories_content">
    <fieldset>
        <legend>
            <h4>
                Current Categories</h4>
        </legend>
        <div class="categories_content">
            @using (Html.BeginForm("DeleteSelected", "Categories"))
            {
                <div class="categories_chain">
                    <div id="tree">
                        @Html.CategoryTree(Model.Categories, true, null)
                    </div>
                    @Html.Hidden("categoriesIds")
                </div>
                <div class="zatify_panel_btn" style="margin-top: 10px;">
                    <input id="btnDeleteCategories" type="submit" class="btn apps_btn apps_gray_btn"
                        value="Delete Selected" />
                    <input id="btnAddNewCategory" type="button" class="btn apps_btn apps_gray_btn" value="Add New" />
                    <input id="btnEditCategory" type="button" class="btn apps_btn apps_gray_btn" value="Edit" />
                    <input id="btnMoveCategory" type="button" class="btn apps_btn apps_gray_btn" value="Move" />
                </div>
            }
        </div>
    </fieldset>
    <fieldset>
        <legend>
            <h4>
                Requested New Categories</h4>
        </legend>
        <div class="categories_content">
            @using (Html.BeginForm("AddRequestedCategories", "Categories"))
            {
                <div class="categories_chain">
                    @Html.ListBox("requestedCategoriesIds", (new MultiSelectList(Model.CategoriesRequests, "CategoryRequestId", "CategoryName")), new { style = "width:100%; height:100%;", size = "5" })
                    @Html.Hidden("parentCategoryId")
                    @Html.Hidden("addRequestedCategories")
                </div>
                <div class="zatify_panel_btn" style="margin-top: 10px;">
                    <input id="btnAddRequestedCategories" type="submit" class="btn apps_btn apps_gray_btn"
                        value="Add Selected" />
                    <input id="btnRejectRequestedCategories" type="submit" class="btn apps_btn apps_gray_btn"
                        value="Reject Selected" />
                </div>
            }
        </div>
    </fieldset>
    @Html.Partial("Partials/AddNewCategoryControl", new Zatify.WebUI.Admin.Models.AddNewCategoryViewModel())
    @Html.Partial("Partials/UpdateCategoryControl", new Zatify.WebUI.Admin.Models.UpdateCategoryViewModel())
    @Html.Partial("Partials/MoveCategoryControl", new Zatify.WebUI.Admin.Models.MoveCategoryViewModel() { Categories = Model.Categories },
                                                  new ViewDataDictionary { { "PopUpID", "moveCategory_Popup" } })
</div>
<div class="clearfix">
</div>
<!--end add new part-->
